<core:SET width='200'>
<core:SET content="content">

<core:SET title="Scrolling news management">
<core:WRAP file="/adm/adm.layout.html" placeholder="Content">

<core:include file="/adm/inc/inc.adm.tabs.html">

<script type="text/javascript" src="/{$#app_name}/FCKeditor/fckeditor.js"></script>
    <script language="Javascript">

    // Gets a element by its Id. Used for shorter coding.
function GetE( elementId )
{
	return document.getElementById( elementId )  ;
}

function ShowE( element, isVisible )
{
	if ( typeof( element ) == 'string' )
		element = GetE( element ) ;
	element.style.display = isVisible ? '' : 'none' ;
}

function SetAttribute( element, attName, attValue )
{
	if ( attValue == null || attValue.length == 0 )
		element.removeAttribute( attName, 0 ) ;			// 0 : Case Insensitive
	else
		element.setAttribute( attName, attValue, 0 ) ;	// 0 : Case Insensitive
}

function GetAttribute( element, attName, valueIfNull )
{
	var oAtt = element.attributes[attName] ;

	if ( oAtt == null || !oAtt.specified )
		return valueIfNull ? valueIfNull : '' ;

	var oValue = element.getAttribute( attName, 2 ) ;

	return ( oValue == null ? valueIfNull : oValue ) ;
}


      //function initEditors()
      window.onload= function()
      {
        var BasePath  = '/{$#app_name}/FCKeditor/';
        var oSummaryEditor = new FCKeditor( 'summary' ) ;
        oSummaryEditor.BasePath = BasePath;
        oSummaryEditor.Height = 350;
        oSummaryEditor.ReplaceTextarea();

      }

      function AddImage() {

        var width = screen.width*0.7;
		var height = screen.height*0.7;

		var iLeft = (screen.width  - width) / 2 ;
        var iTop  = (screen.height - height) / 2 ;

        var sOptions = "toolbar=no,status=no,resizable=yes,dependent=yes" ;
		sOptions += ",width=" + width  ;
		sOptions += ",height=" + height ;
		sOptions += ",left=" + iLeft ;
		sOptions += ",top=" + iTop ;

		var path = '/{$#app_name}/FCKeditor/editor/filemanager/browser/default/browser.html?Type=Image&Connector=connectors/php/connector.php';
   		window.open(path, "FCKBrowseWindow", sOptions ) ;
      }

      function SetUrl( fileUrl ) {
          	document.forms[0].photo_url.value=fileUrl;
          	var picture = GetE('img_picture_url');
          	if (picture) SetAttribute( picture, 'src', fileUrl );
            var size_element =  GetE('size');
          	if (size_element) size_element.style.visibility = 'hidden';
      }

</script>


<h1 align="center"> </h1>

<SCRIPT language="javascript" src="/{$#app_name}/include/zts_picker.js"></SCRIPT>
<script language="javascript">
    function showExpireDateCalendar() {
        var day = document.ScrollingForm.expire_day.value;
        var month = document.ScrollingForm.expire_month.selectedIndex;
        var year = document.ScrollingForm.expire_year.value;
        var dt = new Date();
    	if (day>=1 && month>=1 && year>=2000) dt = new Date(year,month-1,day);
    	var str_dt = dt2dtstr(dt);
    	//alert(str_dt);
    	show_calendar('setExpireDate',str_dt);
    }
	function setExpireDate(str_dt) {
			//alert(str_dt);
			var dt_datetime = (str_dt == null || str_dt =="" ?  new Date() : str2dt(str_dt));
			var month = dt_datetime.getMonth()+1;
			//alert(month);
			var day = dt_datetime.getDate();
            var year = dt_datetime.getYear();
            //alert(day);
            document.ScrollingForm.expire_day.value = day;
            document.ScrollingForm.expire_year.value = year;
            document.ScrollingForm.expire_month.selectedIndex = month;
	}



</SCRIPT>

<form id="ScrollingForm" name="ScrollingForm" method="post" action="" runat="server">
<input name="id" type="hidden" id="id" runat="server">
<input name="page" type="hidden" id="page" runat="server">
<hr>
<core:optional for="msg">
	<span class="message" runat="server"> {$msg} </span>
</core:optional>
<table width="100%" border="0" align="center" cellspacing="2" cellpadding="3">
    <tr align="left">
    	<td class="whiteheader_center">
    		<core:optional for="id">
    			Edit the scrolling news section (ID: {$id})
            </core:optional>
            <core:default for="id">
            	Create a new scrolling news section
            </core:default>
         </td>
         <td class="whiteheader">
            <a href="/{$#app_name}/myprofile/index.htm"> My Profile </a> &nbsp;
           	<html:link url="/">All scrolling news </html:link>
          </td>
     </tr>

    <core:default for="supress_errors">
    <ERRORSUMMARY id='Summary' runat="server">
        <tr valign="top">
          <td width="{width}">Errors: &nbsp;</td>
          <td class="left">
          	<FONT COLOR="RED">
          		<list:ITEM> {$ErrorMessage} &nbsp; </list:ITEM>
          	</FONT>
          </td>
        </tr>
     </ERRORSUMMARY>
     </core:default>

     <tr>
     	<td class="small" colspan="2">
     		<core:optional for="id">
     			Enter your changes to the information below to edit an existing content item.
     			When you are finished, press the Save button.
            </core:optional>
     	</td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="category_id" runat="server">Sport category</label>
       </td>
       <td class="form_field">
      	 <select name='category_id' id='category_id' runat="server">
	 	 </select>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="category2_id" runat="server">Community category</label>
       </td>
       <td class="form_field">
      	 <select name='category2_id' id='category2_id' runat="server">
	 	 </select>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="headline" runat="server">Headline</label>
       </td>
       <td class="form_field">
         <input name="headline" type="text" id="headline" size="50" runat="server">
         <span class="small"> 50 characters limit </span>
       </td>
     </tr>

     <core:optional for="id">
     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="date_added" runat="server">Date Posted:</label>
       </td>
       <td class="form_field">
         <span class="small"> {$date_posted} </span>
       </td>
     </tr>
     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="author" runat="server">Author:</label>
       </td>
       <td class="form_field">
         <span class="small"> {$author_show} </span>
       </td>
     </tr>
     </core:optional>

     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="expiration_date" runat="server">Expiration Date:</label>
       </td>
       <td class="form_field">
         <input name="expire_day" type="text" id="expire_day" size="2" runat="server">
         <select name="expire_month" id="expire_month" runat="server">
         </select>
         <input name="expire_year" type="text" id="expire_year" size="4" runat="server">
         <a href="javascript:showExpireDateCalendar();">
           <img height=20  src="/{$#app_name}/images/calendar.gif" width=20 border=0 >
         </a>
       </td>
     </tr>


     <tr valign="top">
       <td class="form_label" colspan="1">
      	 <label runat="server">Summary text content of the scrolling news </label>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_field" colspan="2">
      	 <textarea name="summary" id="summary" runat="server" cols="80" rows="10"> </textarea>
       </td>
     </tr>


     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="small_picture" runat="server">
      	 	Scrolling news front page picture:
      	 </label>
       </td>
       <td class="form_field">
         <table>
         <tr>
         	<td>
            	<core:optional for="photo_url">
           			<a id="a_picture_url" name="a_picture_url" href="{$photo_url}">
             			<img id="img_picture_url" name="img_picture_url" src="{$photo_url}" border="0"/>
           			</a> <br>
           			<div id="size" name="size">
           			  Size: {$photo_width}*{$photo_height} <br>
           			</div>
                </core:optional>

                <core:default for="photo_url">
                   <img id="img_picture_url" name="img_picture_url" src="/{$#app_name}/images/1x1.gif" border="0"/>
           		   <br>
                </core:default>

                <input name="photo_url" type="text" id="photo_url" runat="server" size="64">
                <BUTTON name="add_image" style="width:150;" class="form_button" onclick="AddImage();">Add/Change image</BUTTON>
         	</td>
            <td>
            </td>
         </tr>
         </table>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$width}">
      	 <label for="orientation" runat="server">Orientation:</label>
       </td>
       <td class="form_field">
         <select name="orientation" id="orientation" runat="server">
         </select> <br>
         <b> NOTE: </b> for vertical orientation the photo must be of 160*210 size <br>
         for horizontal orientation the photo must be of 400*180 size
       </td>
     </tr>

     <tr>
      <td class="whiteheader_center" colspan="2">&nbsp;</td>
     </tr>

	 <tr>
      <td>&nbsp;</td>
      <td class="form_field">

      		<core:default for="id">
      			<input type="submit" name="create" value="Create" runat="server">
            </core:default>
            <core:optional for="id">
      			<input type="submit" name="save" value="Save" runat="server">
                <!--<input type="submit" name="delete" value="Delete" runat="server">-->
            </core:optional>
            <input type="submit" name="clean" value="Clean" runat="server">
            <input type="submit" name="list" value="Back to scrolling items" runat="server">

      </td>
</tr>

</table>
</form>

<!--
<script type="text/javascript" language="Javascript">
	initEditors();
</script>       -->